<template>
  <div class="block">
   <el-pagination
     @size-change="handleSizeChange"
     @current-change="handleCurrentChange"
     :current-page="currentPage"
     :page-sizes="[5, 10, 20, 50]"
     :page-size="pageSize"
     layout="total, sizes, prev, pager, next, jumper"
     :total="total">
   </el-pagination>
 </div>
</template>

<script>
export default {
 props:['total','pageSize','currentPage'],
 methods: {
     handleSizeChange(val) {
       //切换pageSize
       console.log(`每页 ${val} 条`);
       this.$emit('changeSize',val);
     },
     handleCurrentChange(val) {
       //切换当前页
       console.log(`当前页: ${val}`);
       this.$emit('changePage',val)
     }
   },
   data() {
     return {
      
     };
   }
}
</script>

<style>

</style>